<!DOCTYPE html>
<html lang="en">
<head>
    <?php $this->load->view('common/head');?>
    <!-- 本页面所有 -->
    <meta name="keywords" content="特殊教育，家庭，特殊儿童，早期干预，AEPS，个别教育计划，评估">
    <meta name="description" content="七维提供的个人及家庭服务旨在遵循儿童成长规律，掌握个体差异，帮助家长真正做到因材施教，促进儿童能力发展；同时推动家长改善教育方式，系统掌握家庭教育的科学理念与实践方式。">
    <title>七维教育—软件产品</title>
    <!-- 导入自定义字体 -->
    <link rel="stylesheet" href="/assets/css/iconfont.css">
    <script type="text/javascript" src="/assets/js/soft-list.js?v=1"></script>
    <style>
        #app{
            width:1200px;
            margin: 0 auto;
            background-color: white;
        }
        .banner {
            position: relative;
            overflow: hidden;
            width: 1200px;
            height: 594px;
        }
        .banner-img{
            width: 1200px !important;
            height: 594px !important;
            left: 0 !important;
            margin-left: 0 !important;
        }
        .banner-tip-wrapper{
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 180px;
        }
        .banner-tip-container{
            margin-left: 30px;
            margin-top: -122px;
            width: 540px;
            padding: 40px 34px 34px 34px;
            z-index: 99;
            background-color: white;
            box-shadow: 3px 3px 6px rgba(0,0,0, 0.1);
        }
        .banner-tip-title{
            color: #454545;
            font-size: 26px;
            font-weight: bold;
            margin-bottom: 40px;
        }
        .banner-tip-tm{
            color: #919191;
            font-size: 8px;
            font-weight: bold;
            margin-left:10px;
            margin-right: 10px;
        }
        .banner-tip-desc{
            font-size: 20px;
            color: #919191;
        }
        .banner-tip-right-wrapper{
            display: flex;
            justify-content: flex-start;
            align-items: center;
        }
        .banner-tip-right-line{
            background-color: #454545;
            margin-right: 5px;
            height: 2px;
            width: 50px
        }
        .banner-tip-right-text{
            color: #454545;
            font-size: 26px;
            font-weight: bold;
        }
        .content{
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
        }
        .block-item{
            margin: 0 60px 140px 60px;
            width: 420px;
        }
        .mt-100{
            margin-top:100px;
        }
        .block-img {
            width: 420px;
            height: 480px;
        }
        .block-title {
            color: #454545;
            font-size: 22px;
            font-weight:bold;
            margin-top: 45px;
            margin-bottom: 40px;
        }
        .block-desc{
            color: #919191;
            font-size: 20px;
            line-height: 28px;
        }
    </style>
</head>
<body>
<div id="header" class="header">
    <?php $this->load->view('common/header');?>
</div>
<div id="app" class="container">
    <div id="fullpage" class="banner">
        <img :src="soft.imgDetail" class="banner-img" alt="">
    </div>
    <div class="banner-tip-wrapper">
        <div class="banner-tip-container">
            <div class="banner-tip-title">
                七维<span class="banner-tip-tm">TM</span>{{soft.title}}
            </div>
            <div class="banner-tip-desc">
                {{soft.desc}}
            </div>
        </div>
        <div class="banner-tip-right-wrapper">
            <div class="banner-tip-right-line"></div>
            <div class="banner-tip-right-text">{{soft.rightDesc}}</div>
        </div>
    </div>
    <div class="content">
        <div v-for="(block, index) in soft.blockList" :class="'block-item '+(index%2?'mt-100':'')">
            <img :src="block.img" class="block-img" alt="">
            <div class="block-title">{{block.title}}</div>
            <div class="block-desc">{{block.desc}}</div>
        </div>
    </div>
</div>
<div class="footer">
    <?php $this->load->view('common/footer');?>
</div>
<script>
    $(function () {
        var softIndex = parseInt(getQueryString("index"));
        softIndex = softIndex || 0;

        window.vm = new Vue({
            el:'#app',
            data:{
               soft: softList[softIndex],
            },
            computed:{
                showingImg:function(){
                    return this.sliderImgs[this.sliderIndex];
                }
            },
            methods:{

            },
            mounted:function(){

            }
        })

        function getQueryString(name) {
            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
            var search = decodeURIComponent(window.location.search.substr(1));
            var r = search.match(reg);
            if (r != null) return r[2]; return null;
        }
    })
</script>
</body>
</html>
